<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>JavaScript 引用和值拷贝</title>
	</head>
	<body>
		<h1>打开控制台查看输出结果</h1>
		<script type="text/javascript">
			console.clear();
			// 按值操作，String,Number,Boolean,Null,Undefined
			let age = 100;
			let age2 = age;
			console.log(age, age2);
			age = 200;
			console.log(age, age2);

			let name = 'ligang';
			let name2 = name;
			console.log(name, name2);
			name = 'lig';
			console.log(name, name2);

			// 通过引用操作，Object,Function,Array,Set,Map
			const players = ['Wes', 'Sarah', 'Ryan', 'Poppy'];

			//引用拷贝
			const team = players;

			console.log(`players:${players}`, `team:${team}`);

			//我们做如下操作；
			team[3] = 'Lux';

			console.log(`players:${players}`, `team:${team}`);

			const team2 = players.slice();

			console.log(`players:${players}`, `team:${team}`, `team2:${team2}`);

			//深拷贝
			//创建新数组并且将原来的数组拼接到新数组中
			const team3 = [].concat(players);

			//ES6 Spread语法
			const team4 = [...players];
			team4[3] = 'heee hawww';
			console.log(`team4:${team4}`);

			const team5 = Array.from(players);
			console.log(`team5:${team5}`);

			//深拷贝和浅拷贝对比
			//创建object对象
			const person = {
				name: '李刚',
				age: 27
			}

			//浅拷贝
			console.log(`person:${JSON.stringify(person)}`);
			const captain = person;
			captain.number = 99;
			console.log(`person:${JSON.stringify(person)}`);
			console.log(`captain:${JSON.stringify(captain)}`);

			//深拷贝
			const cap2 = Object.assign({}, person, {
				number: 99,
				age: 12
			});
			console.log(`cap2:${JSON.stringify(cap2)}`);
			console.log(`person:${JSON.stringify(person)}`);

			//采用JSON字符串
			//对象的嵌套
			const ligang = {
				name: '李刚',
				age: 100,
				social: {
					sina: 'lg8294',
					qq: '515930926'
				}
			}

			console.log(`ligang:${ligang}`);

			const dev = Object.assign({}, ligang);
			console.log(`dev:${dev}`);

			const dev2 = JSON.stringify(ligang);
			console.log(`dev2:${dev2}`);

			const dev3 = JSON.parse(JSON.stringify(ligang));
			console.log(`dev3:${dev3}`);
		</script>
	</body>
</html>
